{% extends 'base_no_cart.html'%}

{%block topfiles%}
{%load static%}
<script type="text/javascript" src="{%static 'js/jquery-1.12.4.min.js'%}"></script>
<script>
	$(function(){
		$('#chose_all').change(function(){
			check=$(this).prop('checked')
			if (check){
				
				$('.good_check').prop('checked',true)
			}
			else{
				
				$('.good_check').prop('checked',false)
			}
			all_goods_cal()
		})
		$('.good_check').change(function choose(){
			check=$(this).prop('checked')
			if(!check){
				
				$('#chose_all').prop('checked',false)
			}
			else{
				
				boxes=$('.good_check')
				flag=true
				for(var i=0;i<boxes.length;i++){
					if (! boxes.eq(i).prop('checked')){
						flag=false
						break
					}
				}
				if (flag){
					$('#chose_all').prop('checked',true)
				}
			}
			all_goods_cal()
		})
		function get_count(good_id){
	
			count_id='#count_'+good_id


			count=$(count_id).val()
			return parseInt(count)
		}
		function get_single_price(good_id){
			single_price_id='#single_price_'+good_id


			price=$(single_price_id).attr('single_price')
	
	
			return parseInt(price)

		
		}
		function set_price(good_id){
			
		
			price_id='#price_'+good_id
			
		
			
			sum_p=get_count(good_id)*get_single_price(good_id)

			$(price_id).text(sum_p+'元')
		}
		function all_goods_cal(){
			count_sum=0
			cost_sum=0
			for(var i=1;i<{{cart_all.values|length}}+1;i++){
				
				if ($('#single_price_'+i).prevAll('li').eq(3).children().prop('checked')){
			count_sum=count_sum+get_count(i)
			cost_sum=cost_sum+get_count(i)*get_single_price(i)
				}
			//console.log(count_sum,cost_sum)
		}
			$('#all_goods').text(count_sum)
			$('#all_goods_cost').text(cost_sum)

		}
		$('.add').click(function (e) {
		target=$(this).next()
		sku_id=target.attr('sku_id')
		// 获取商品原有的数目
		count = target.val();
		// 加1
		count = parseInt(count)+1;
		csrf = $('input[name="csrfmiddlewaretoken"]').val();
            // 组织参数
        params = {'sku_id':sku_id, 'count':count, 'csrfmiddlewaretoken':csrf};
		$.post('/cart/update', params, function (data) {
                if (data.res == 5){
                    		// 重新设置商品的数目
						console.log(count)
						console.log($(this))
						target.val(count);
						// 更新商品的总价
						good_id=target.attr('id').split('_')[1]
						console.log(good_id)
						set_price(good_id)
						all_goods_cal()

                }
                else{
                    // 添加失败
                    alert(data.msg)
                }
            })
		
		
		
		



		});

		// 减少商品的数量
		$('.minus').click(function (e) {
		target=$(this).prev()
		sku_id=target.attr('sku_id')
		// 获取商品原有的数目
		count = target.val();
		// 减1
		count = parseInt(count)-1;
		if (count < 0){
			count = 0
		}
		csrf = $('input[name="csrfmiddlewaretoken"]').val();
            // 组织参数
        params = {'sku_id':sku_id, 'count':count, 'csrfmiddlewaretoken':csrf};
		$.post('/cart/update', params, function (data) {
                if (data.res == 5){
                    		// 重新设置商品的数目
						console.log(count)
						console.log($(this))
						target.val(count);
						// 更新商品的总价
						good_id=target.attr('id').split('_')[1]
						console.log(good_id)
						set_price(good_id)
						all_goods_cal()

                }
                else{
                    // 添加失败
                    alert(data.msg)
                }
            })
		

		});
		$('.num_show').blur(function () {
			// 获取用户输入的数目
			target=$(this)
			sku_id=target.attr('sku_id')
            count = $(this).val();
            // 校验count是否合法
            if (isNaN(count) || count.trim().length==0 || parseInt(count) <=0){
                count = 1
			}
			csrf = $('input[name="csrfmiddlewaretoken"]').val();
            // 组织参数
        	params = {'sku_id':sku_id, 'count':count, 'csrfmiddlewaretoken':csrf};
			$.post('/cart/update', params, function (data) {
        	        if (data.res == 5){
        	            		// 重新设置商品的数目
							console.log(count)
							console.log($(this))
							target.val(count);
							// 更新商品的总价
							good_id=target.attr('id').split('_')[1]
							console.log(good_id)
							set_price(good_id)
							all_goods_cal()

        	        }
        	        else{
        	            // 添加失败
        	            alert(data.msg)
        	        }
        	    })

        });
		console.log($('.col08 a'))
		$('.col08 a').click(function(){
			ul=$(this).parents('ul')
			console.log(ul)
			sku_id=ul.attr('sku_id')
			console.log(sku_id)
			csrf = $('input[name="csrfmiddlewaretoken"]').val();
			params = {'sku_id':sku_id,  'csrfmiddlewaretoken':csrf};
			
			$.post('/cart/delete', params, function (data) {
                if (data.res == 5){
						ul.remove()
						all_goods_cal()

                }
                else{
                    // 添加失败
                    alert(data.msg)
                }
            })
		})
		for(var i=1;i<{{cart_all.values|length}}+1;i++){

			set_price(i)
			
		}
		all_goods_cal()
	})
</script>
{%endblock topfiles%}
{%block page_title%}购物车{%endblock page_title%}
{%block body%}
	<div class="total_count">全部商品<em>{{cart_all|length}}</em>件</div>	
	<ul class="cart_list_th clearfix">
		<li class="col01">商品名称</li>
		<li class="col02">商品单位</li>
		<li class="col03">商品价格</li>
		<li class="col04">数量</li>
		<li class="col05">小计</li>
		<li class="col06">操作</li>
	</ul>
	<form method="POST" action="/order/order_place">
	{%for good in cart_all.values%}
	
	<ul class="cart_list_td clearfix" sku_id="{{good.good_sku.id}}">
		<li class="col01"><input type="checkbox" name="goods" checked class="good_check" value={{good.good_sku.id}}></li>
		<li class="col02"><img src="{{good.good_sku.image.url}}"></li>
		<li class="col03">{{good.good_sku.name}}<br><em>{{good.good_sku.price}}元/{{good.good_sku.unite}}</em></li>
		<li class="col04" >{{good.good_sku.unite}}</li>
		<li class="col05" id='single_price_{{forloop.counter}}' single_price={{good.good_sku.price}}>{{good.good_sku.price}}元</li>
		<li class="col06">
			<div class="num_add">
				<a href="javascript:;" class="add fl">+</a>
				<input type="text" class="num_show fl" value='{{good.num.decode}}' id="count_{{forloop.counter}}" sku_id="{{good.good_sku.id}}">	
				<a href="javascript:;" class="minus fl">-</a>	
			</div>
		</li>
		<li class="col07" id="price_{{forloop.counter}}">25.80元</li>
		<li class="col08"><a href="javascript:;">删除</a></li>
	</ul>
	{%endfor%}


	<ul class="settlements">
		{%csrf_token%}
		<li class="col01"><input type="checkbox" name="" checked="" id='chose_all'></li>
		<li class="col02">全选</li>
		<li class="col03">合计(不含运费)：<span>¥</span><em id='all_goods_cost'>0</em><br>共计<b id='all_goods'>0</b>件商品</li>
		<li class="col04"><input type="submit" value="提交订单"></li>
	</ul>
	</form>
{%endblock body%}

